<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <div th:replace="~{common/common-head.html::common-head}"></div>
</head>
<body class="body-common">
<div class="page-container">
    <blockquote class="layui-elem-quote">
        <form id="dataForm" class="layui-form">
            <div class="layui-form-item">
                <div class="layui-inline" >
                    <input type="text" name="id" id="id" placeholder="操作日志" class="layui-input">
                </div>
                <div class="layui-inline" >
                    <input type="text" name="sysUserId" id="sysUserId" placeholder="用户id" class="layui-input">
                </div>
                <div class="layui-inline" >
                    <input type="text" name="sysAuthId" id="sysAuthId" placeholder="权限id" class="layui-input">
                </div>
                <div class="layui-inline"  >
                    <input type="text" name="createTime" id="createTime" placeholder="创建时间" class="layui-input">
                </div>
                <div class="layui-inline">
                    <input type="text" name="startDate" id="startDate" placeholder="开始时间" class="layui-input">
                </div>
                <div class="layui-inline">
                    <input type="text" name="endDate" id="endDate" placeholder="结束时间" class="layui-input">
                </div>
                <div class="layui-inline">
                    <input type="button" name="" class="layui-btn" onclick="loadMyData()" data-type="reload"
                           th:value="搜索"/>
                </div>
            </div>
        </form>
    </blockquote>
    <div class="mt-20">
        <table id="table-data" lay-filter="table-data"></table>
    </div>
</div>
<script type="text/html" id="toolbar-data">
    <span th:if="${session.userAuth==null || #maps.containsKey(session.userAuth,'sysOperationLog/export')}">
    <a href="javascript:void(0)" onclick="exports()" class="layui-btn layui-btn-warm layui-btn-sm"><i  class="layui-icon layui-icon-download-circle"></i> 导出</a>
    </span>
</script>
<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" th:inline="javascript">
    var table;
    layui.use(['form', 'table', 'laydate'], function () {
        var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
        //但是，如果你的HTML是动态生成的，自动渲染就会失效
        //因此你需要在相应的地方，执行下述方法来手动渲染，跟这类似的还有 element.init();
        form.render();
        table = layui.table;
        //第一个实例
        table.render({
            elem: '#table-data'
            , toolbar: '#toolbar-data'
            , url: rootPath + "sysOperationLog/selectAll" //数据接口
            , method: "post"
            , page: true //开启分页
            , cols: [[ //表头
                {field: 'id', title: 'id', type: "checkbox"}
                ,{field: 'id', title: '操作日志'}
                ,{field: 'sysUserId', title: '用户id'}
                ,{field: 'sysAuthId', title: '权限id'}
                ,{field: 'authName', title: '权限名'}
                ,{field: 'authHref', title: '权限链接'}
                ,{field: 'ip', title: 'IP地址'}
                ,{field: 'createTime_', title: '创建时间'}
                ,{field: 'requestParam', title: '请求参数'}
                ,{field: 'exceptions', title: '异常'}
            ]],
            parseData: function (res) { //res 即为原始返回的数据
                return {
                    "code": res.code, //解析接口状态
                    "msg": res.message, //解析提示文本
                    "count": res.data.total, //解析数据长度
                    "data": res.data.rows //解析数据列表
                };
            },
            "request": {
                pageName: 'page' //页码的参数名称，默认：page
                , limitName: 'pageSize' //每页数据量的参数名，默认：limit
            },
            "response": {
                statusName: 'code' //规定数据状态的字段名称，默认：code
                , statusCode: 0 //规定成功的状态码，默认：0
            }
        });
        //监听行工具事件
        table.on('tool(table-data)', function (obj) {
            var data = obj.data;
            //console.log(obj)
            if (obj.event === 'del') {
                myConfirm("确定要删除吗?", function (index) {
                    obj.del();
                    $.post(rootPath + "sysOperationLog/deleteByPrimaryKey", {"id": data.id}, function (data) {
                        myAlert("删除成功");
                        setTimeout(function () {
                            loadMyData()
                        }, 2000)
                    });
                    layer.close(index);
                })
            } else if (obj.event === 'edit') {
                window.location.href = rootPath + "sysOperationLog/gotoDetail?id=" + data.id;
            }
        });

        /*初始化日期选择框 begin*/
        var laydate = layui.laydate;
        laydate.render({
            elem: '#startDate'
            , type: 'datetime'
        });
        laydate.render({
            elem: '#endDate'
            , type: 'datetime'
        });

       laydate.render({
           elem: '#createTime'
           , type: 'datetime'
       });
        /*初始化日期选择框 end*/
    });

    function loadMyData() {
        table.reload("table-data", {
            where: $("#dataForm").serializeObject()
            , page: {
                curr: 1 //重新从第 1 页开始
            }
        });
    }

    //导出
    function exports() {
        window.location.href = rootPath + "sysOperationLog/export?" + $("#dataForm").serialize()
    }

</script>
</body>
</html>